<script>
import TabBar from './components/TabBar.vue';
const deviceHeight = (750 / weex.config.env.deviceWidth * weex.config.env.deviceHeight) - 150;
export default {
  components: { TabBar },
  data() {
    return {
      deviceHeight,
      showTabBar: true
    }
  },
  methods: {
    back: function() {
      modal.toast({ message: 'back' });
      this.$router.back()
    },
    getInitData() {
      this.$store.dispatch('getTabsData');
      this.$store.dispatch('getTabBarData');
    }
  },
  watch: {
    '$route': function(val) {
      console.log(val);
      if (val.name === 'home' || val.name === 'category') {
        this.showTabBar = true
      } else {
        this.showTabBar = false;
      }
    }
  },
  created() {
    this.getInitData();
  }
}
</script>
<template>
  <div @androidback="back">
    <!--<scroller class="scroller" :style="{'height':deviceHeight}">-->
    <!--<keep-alive>-->
    <div class="view" :style="{height:deviceHeight}">
      <router-view style="flex:1"></router-view>
    </div>
    <!--</keep-alive>-->
    <!--</scroller>-->

    <tab-bar v-if="showTabBar"></tab-bar>
  </div>
</template>

<style>
body {
  margin: 0;
}
</style>
